import 'package:flutter/material.dart';

import '../../pages/general/EventDetailView.dart';
import '../../pojo/vo/EventVo.dart';

class EventItem extends StatefulWidget {
  const EventItem({super.key, required this.eventVo, this.onTap,});

  final EventVo eventVo;
  final VoidCallback? onTap;


  @override
  State<EventItem> createState() => _EventItemState();
}

class _EventItemState extends State<EventItem> {

  Widget _initRemainingDaysTips(){
    String? endDate = widget.eventVo.endDate;
    if(endDate != null){
      DateTime endDateTime = DateTime.parse(endDate);
      DateTime now = DateTime.now();
      Duration difference = endDateTime.difference(now);
      int remainingDays = difference.inDays;
      return _RemainingDaysTips(remainingDay: remainingDays);
    }
    return const SizedBox();
  }

  Widget _initTitleAndSubtitle() {
    return Positioned(
      bottom: 10,
      left: 10,
      child: Container(
        padding: const EdgeInsets.all(8),
        decoration: BoxDecoration(
          color: Colors.black.withOpacity(0.5),
          borderRadius: BorderRadius.circular(10),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              widget.eventVo.title!,
              style: const TextStyle(
                color: Colors.white,
                fontWeight: FontWeight.bold,
                fontSize: 20,
              ),
            ),
            Text(
              "-- ${widget.eventVo.subTitle}",
              style: const TextStyle(
                color: Colors.white,
                fontSize: 17,
              ),
            ),
          ],
        ),
      ),
    );
  }

  DecorationImage _initImage(){
    return widget.eventVo.imageUrl == null ?
    const DecorationImage(
        fit: BoxFit.cover,
        image: AssetImage("assets/images/Default_event_picture.png")
    ):
    DecorationImage(
        fit: BoxFit.cover,
        image: NetworkImage(widget.eventVo.imageUrl!)
    );
  }

  void toEventDetailPage(){
    // TODO:到时候这里 判断也没有 rountName，决定跳转到哪个页面
    Navigator.of(context).push(
        MaterialPageRoute(
            builder: (context) => EventDetailView(eventVo: widget.eventVo,)
        )
    );
  }

  @override
  Widget build(BuildContext context) {
    return Card(
        shape: RoundedRectangleBorder(              // 形状
            borderRadius: BorderRadius.circular(15)   // 圆角
        ),
        elevation: 3,
        color: Theme.of(context).colorScheme.secondary.withAlpha(170),
        child: InkWell(
          onTap: widget.onTap ?? toEventDetailPage,
          child: Column(
            children: [
              Stack(
                children: [
                  Hero(
                      tag: "event_${widget.eventVo.id}_image",
                      child: AspectRatio(
                        aspectRatio: 16/9,   // 16:9
                        child: Container(
                          decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(15),
                              image: _initImage()
                          ),
                        ),
                      )
                  ),
                  _initRemainingDaysTips(),
                  _initTitleAndSubtitle(),
                ],
              ),
            ],
          ),
        )
    );
  }
}

/// 剩余天数的提示
// 后续它应该是有状态的
class _RemainingDaysTips extends StatelessWidget {
  const _RemainingDaysTips({super.key, required this.remainingDay});

  final int remainingDay;

  @override
  Widget build(BuildContext context) {
    return Positioned(
        bottom: 10,
        right: 10,
        child: Container(
          width: 88,
          height: 28,
          alignment: Alignment.center,
          decoration: BoxDecoration(
            color: remainingDay <= 5 ?
            Theme.of(context).colorScheme.error:
            Theme.of(context).colorScheme.primary,
            borderRadius: BorderRadius.circular(15),
          ),
          child: Text(
            "剩余$remainingDay天",
            style: TextStyle(
                color: Theme.of(context).colorScheme.background
            ) ,
          ),
        )
    );
  }
}


class WeeklyTrend extends StatelessWidget {
//   const  WeeklyTrend({super.key});
//
//   LineChartData mainData() {
//     // 定义渐变色
//     List<Color> gradientColors = [
//       const Color(0xff469bcf), // 渐变色的起始颜色
//       const Color(0xff46cfbf), // 渐变色的结束颜色
//     ];
//
//     // 返回一个LineChartData对象，用于配置折线图
//     return LineChartData(
//       // 配置图表的标题数据
//       titlesData: FlTitlesData(
//         show: true, // 是否显示标题
//         // 配置X轴（底部）标题
//         bottomTitles: SideTitles(
//           showTitles: false, // 不显示X轴的标题
//         ),
//         // 配置Y轴（左侧）标题
//         leftTitles: SideTitles(
//           showTitles: true, // 显示Y轴的标题
//           reservedSize: 5, // 标题的保留空间大小
//           // 获取Y轴标题的回调函数
//           getTitles: (value) {
//             if (value == 0) {
//               return '0'; // 当Y轴值为0时，显示'0'
//             } else if (value % 2 == 0) {
//               return '${value.toInt()}'; // 当Y轴值为偶数时，显示该值
//             }
//             return ''; // 其他情况不显示标题
//           },
//         ),
//       ),
//       // 设置X轴的最小值和最大值
//       minX: 0,
//       maxX: 7,
//       // 设置Y轴的最小值和最大值
//       minY: 0,
//       maxY: 8,
//       // 折线图的数据条
//       lineBarsData: [
//         LineChartBarData(
//           // 数据点集合
//           spots: [
//             FlSpot(0, 3), // (X, Y)坐标点
//             FlSpot(1, 2),
//             FlSpot(2, 3),
//             FlSpot(3, 4),
//             FlSpot(4, 3),
//             FlSpot(5, 4),
//             FlSpot(6, 4),
//             FlSpot(7, 5),
//           ],
//           // 是否显示为曲线
//           isCurved: true,
//           // 折线的颜色
//           colors: gradientColors,
//           // 折线下方区域的数据
//           belowBarData: BarAreaData(
//             show: true, // 是否显示区域
//             // 区域颜色，使用透明度为0.3的渐变色
//             colors: gradientColors.map((color) => color.withOpacity(0.3)).toList(),
//           ),
//         ),
//       ],
//     );
//   }

  @override
  Widget build(BuildContext context) {
    return Card(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(15),
      ),
      elevation: 3,
      child: const Column(
        children: <Widget>[
          // Expanded(
          //   child: Padding(
          //     padding: const EdgeInsets.all(23),
          //     child: LineChart(
          //       mainData(),
          //     ),
          //   ),
          // ),
          ListTile(
            title: Text(
              '本周刷词趋势',
              style: TextStyle(
                fontWeight: FontWeight.w600,
                fontSize: 18,
              ),
            ),
            trailing: Icon(Icons.show_chart),
          ),
        ],
      ),
    );
  }
}






